﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>选择充值方式</title>
		<link rel="stylesheet" href="../css/main.css" />
	</head>
	<body>
		<div id="app">
			<header class="checkways">支付方式</header>
			<section>
				<div class="checkes" v-for="(list,index) in lists" :key="list.id" @click="checks(index)">
					<img :src="list.src" />
					<span>{{list.content}}</span>
					<img v-if="list.isCheck" src="../img/checked.png"/>
					<img v-else src="../img/check.png"/>
				</div>
				<div class="arset">
					<span @click="goPay">立即支付</span>
				</div>
				<p class="xieyi">点击“立即支付”表示已阅读并同意<a href="http://static.jinkell.com/rescource/recharge.html">《优贷客充值协议》</a></p>
			</section>
			<!--loading-->
			<div class="loading" v-show="isLoading">
				<div class="wx_loading_icon"></div>
			</div>
			<!--支付成功弹窗提示-->
			<!--<div class="successDia">-->
			<div class="loading" v-show="isSuccess"></div>
			<div class="contentCW" v-show="isSuccess">
				<img src="../img/pic_chongzhiwc.png" />
				<p>您本次充值的{{money}}金币与赠送的金币均已到账</p>
				<img src="../img/ico_guanbinn.png" @click="closeDia"/>
			</div>
			<!--</div>-->
			
		</div>
	</body>
	<script type="text/javascript" src="../js/rem.js" ></script>
	<script type="text/javascript" src="../js/vue.js" ></script>
	<script type="text/javascript" src="../js/axios.min.js" ></script>
	<script type="text/javascript" src="../js/md5.min.js" ></script>
	<script>
		var userIds=localStorage.getItem("userIds");
//		var userIds="fea4e41fa81c4264aad9cb095772e5eb";
		var tokens=localStorage.getItem("tokens");
//		var tokens="ZmY0NDg5OTMxNzQ0NGNkZjkwODMzMzZlOTc4MjM1ZmMxNTMwMDA3ODIx";
		var deviceNumber=localStorage.getItem("deviceNumber");
//		var deviceNumber="357710186792243";
		
		new Vue({
			el:"#app",
			data:{
				checkType:"",
				money:"",
				index:"0",
				isLoading:false,
				isSuccess:false,
				postUrl:"http://test.daiqianma.cn/loan",
				lists:[
//					{id:"1",src:"../img/ico_zhifuweixin.png",content:"微信",isCheck:true},
					{id:"2",src:"../img/ico_zhifubao.png",content:"支付宝",isCheck:true},
					{id:"3",src:"../img/ico_lainlian.png",content:"连连支付",isCheck:false},
				],
			},
			created(){
				//获取充值类型
				this.checkType=localStorage.getItem("checkId");
				this.money=localStorage.getItem("money");
			},
			methods:{
				checks(index){
					for(var i=0;i<this.lists.length;i++){
						this.lists[i].isCheck=false;
					}
					this.lists[index].isCheck=true;
					this.index=index;
				},
				goPay(){
//					if(this.index == "0"){//微信
//						
//					}else 
					
					var params = "userId=" + userIds +"&nonceStr=" + new Date().getTime() +"&deviceNumber=" + deviceNumber +
					"&goldDepositsId=" + this.checkType + "&payWay=" + 4 + "&payEnvironment=" + 1;
					var params2 = "userId=" + userIds +"&nonceStr=" + new Date().getTime() +"&deviceNumber=" + deviceNumber +
					"&goldDepositsId=" + this.checkType + "&payWay=" + 6 + "&payEnvironment=" + 1;
					var urls=params.split("&").sort().join("&");
					var urls2=params2.split("&").sort().join("&");
					var signZh = md5(urls+"&token="+tokens).toUpperCase();
					var signLL = md5(urls2+"&token="+tokens).toUpperCase(); 
					if(this.index == "0"){//支付宝
//						var urls=this.postUrl+"/payment/managerRechange/creatPayOrderForH5.htm?userId="+userIds+"&goldDepositsId="
//						+this.checkType+"&payWay=4&payEnvironment=1";
						var urls=this.postUrl+"/payment/managerRechange/creatPayOrderForH5.htm?sign="+signZh+"&"+params;
						console.log(urls);
						window.location.href=urls;
					}else{//连连支付
//						var urls2=this.postUrl+"/payment/managerRechange/creatPayOrderForH5.htm?userId="+userIds+"&goldDepositsId="
//						+this.checkType+"&payWay=6&payEnvironment=1";
						var urls2=this.postUrl+"/payment/managerRechange/creatPayOrderForH5.htm?sign="+signLL+"&"+params2;
						console.log(urls2);
						window.location.href=urls2;
					}
				},
				closeDia(){
					this.isSuccess=false;
				},
				
			}
		});
	</script>
</html>
